<template>
	<!-- 第一个view节点必须有，其他的都被这个包裹 -->
	<view> 
 

		<u-swiper :list="list1" :indicator='true' ></u-swiper>
		钩子 什么是钩子  钟馗的钩子？ 可以钩敌人对吧
		我们vue的钩子是钩函数的也就是（方法）
		onCreat()
		onShow
		<br>
		{{name}}
		<u-grid :border="false"  >
			<u-grid-item v-for="(baseListItem,baseListIndex) in baseList" :key="baseListIndex">
				<u-icon :customStyle="{paddingTop:20+'rpx'}" :name="baseListItem.name" :size="22"></u-icon>
				<text class="grid-text">{{baseListItem.title}}</text>
			</u-grid-item>
		</u-grid>
		 <u-list
		 			@scrolltolower="scrolltolower"
		 		>
		 			<u-list-item
		 				v-for="(item, index) in urls"
		 				:key="index"
		 			>
		 				<u-cell
		 					:title="`列表长度-${index + 1}`"
		 				>
		 					<u-avatar
		 						slot="icon"
		 						shape="square"
		 						size="35"
		 						:src="item.url"
		 						customStyle="margin: -3px 5px -3px 0"
		 					></u-avatar>
		 				</u-cell>
		 			</u-list-item>
		 		</u-list>
	</view>
</template>

<script> 
	export default {
		data() {
			return {
				indexList: [],
				urls: [
									'https://cdn.uviewui.com/uview/album/1.jpg',
									'https://cdn.uviewui.com/uview/album/2.jpg',
									'https://cdn.uviewui.com/uview/album/3.jpg',
									'https://cdn.uviewui.com/uview/album/4.jpg',
									'https://cdn.uviewui.com/uview/album/5.jpg',
									'https://cdn.uviewui.com/uview/album/6.jpg',
									'https://cdn.uviewui.com/uview/album/7.jpg',
									'https://cdn.uviewui.com/uview/album/8.jpg',
									'https://cdn.uviewui.com/uview/album/9.jpg',
									'https://cdn.uviewui.com/uview/album/10.jpg',
								],
				baseList: [{
						name: 'photo',
						title: '图片'
					},
					{
						name: 'lock',
						title: '锁头'
					},
					{
						name: 'star',
						title: '星星'
					},
					{
						name: 'photo',
						title: '图片'
					},
					{
						name: 'lock',
						title: '锁头'
					},
					{
						name: 'star',
						title: '星星'
					},
				],
				person: {
					name: '李四',
					age: 21
				},
				name: '张三',
				list1: [
					'https://publish-pic-cpu.baidu.com/f4e7b4ec-b622-45ed-b80d-6523c0c6d6f1.jpeg@q_90,w_450',
					'https://publish-pic-cpu.baidu.com/50e48f50-a030-4a4e-8aaa-2be46eef3926.jpeg@q_90,w_450|f_webp',
					'https://cdn.uviewui.com/uview/swiper/swiper3.png',
				]
			}
		},
		//methods 这个里面写事件或者方法  也就是行为吧
		//show展示的时候
		onShow() {
			console.log('我显示了')
			let a=2,b=4
			console.log('求和',a+b)
		},
		created() {
			
		},
		mounted() {
			
		},
		methods: {
				cc(){
					console.log('打印啦')
				}
		}
	}
</script>

<style lang="scss">
	
</style>
